<!--
Copyright Adam Pritchard 2013
MIT License : http://adampritchard.mit-license.org/
-->

<!DOCTYPE html>

<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="utils.js"></script>
  <script src="common-logic.js"></script>
  <script src="jsHtmlToText.js"></script>
  <script src="marked.js"></script>
  <script src="mdh-html-to-text.js"></script>
  <script src="markdown-here.js"></script>
  <script src="options-iframe.js"></script>
  <script src="vendor/jquery-3.2.1.slim.min.js"></script>

  <style>
  /* We don't really want to add styles to the preview because it might confuse
     users when they are playing with their own styles. However, it's also
     pretty confusing to show a serif font in the preview when email clients
     almost always use a sans serif font by default.
  */
  body {
    font-family: Arial, sans;
  }
  </style>
</head>

<!-- NOTE: The content of the <body> *must not* be indented or have comments,
     otherwise it will affect the MD rendering. -->

<body contenteditable="true" data-i18n="preview_markdown" spellcheck="false">
```javascript<br>
function syntaxHighlighting() {<br>
&nbsp; var n = 33;<br>
&nbsp; var s = "hello, こんにちは";<br>
&nbsp; console.log(s);<br>
}<br>
```<br>
<br>
* plain<br>
* *emphasis*<br>
&nbsp; * **strong emphasis**<br>
&nbsp; &nbsp; * ~~strikethrough~~<br>
* `inline code`<br>
<br>
1. Numbered list<br>
&nbsp;&nbsp;&nbsp;1. Numbered sub-list<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;1. Numbered sub-sub-list<br>\n
2. [Link](https://www.google.com)<br>
<br>
<br>
An image: ![Markdown Here logo](https://raw.githubusercontent.com/adam-p/markdown-here/master/src/common/images/icon24.png)
<br>
<br>
> Block quote.&nbsp; <br>
> *With* **some** `markdown`.<br>
<br>
If **TeX Math** support is enabled, this is the quadratic equation:&nbsp;<br>
$-b \pm \sqrt{b^2 - 4ac} \over 2a$<br>
<br>
# Header 1<br>
## Header 2<br>
### Header 3<br>
#### Header 4<br>
##### Header 5<br>
###### Header 6<br>
&nbsp; <br>
| Tables        | Are           | Cool  |<br>
| ------------- |:-------------:| -----:|<br>
| column 3 is   | right-aligned | $1600 |<br>
| column 2 is   | centered      |   $12 |<br>
| zebra stripes | are neat      |    $1 |<br>
<br>
Here's a horizontal rule:<br>
<br>
---<br>
<br>
```<br>
code block<br>
with no highlighting<br>
```<br>
<br>

</body>

</html>
